<template>
    <div>
        <!-- 列表详情页 -->
        <ul>            
            <li v-for="item in datalist" :key="item.filmId" @click="handleClick(item.filmId)">
                
                <!-- {{ item.name }} -->
                <Film :data="item"></Film>
            </li>
        </ul>
    </div>
</template>


<script setup>
import axios from 'axios'
import { onMounted, ref } from 'vue'
import { useRouter } from 'vue-router'
import Film from './Film.vue'

const router = useRouter()
const datalist = ref([])

onMounted(async () => {
    const res = await axios({
        url: 'https://m.maizuo.com/gateway?cityId=110100&pageNum=1&pageSize=10&type=1&k=2862782',
        headers: {
            'X-Client-Info': '{"a":"3000","ch":"1002","v":"5.2.1","e":"17089542072373175589470209","bc":"110100"}',
            'X-Host': 'mall.film-ticket.film.list',
        }
    })
    console.log(res.data.data.films);
    datalist.value = res.data.data.films
    console.log(datalist);
})

const handleClick = (id) => {
    router.push({
        name: 'detail',
        params: {
            myid: id
        }
    })
}
</script >


<style scoped lang="scss">

</style>